<div class="card mb-4">
    <h6 class="card-header">
        Attribute
    </h6>
    <div class="card-body">
        <div class="row form-group">
            <div class="col">
                <label>Title</label>
                <input type="text" class="form-control" ng-model="$ctrl.model.title" ng-blur="$ctrl.gennerateName()">
            </div>
            <div class="col">
                <label>Name</label>
                <input type="text" class="form-control" ng-model="$ctrl.model.name">
            </div>
        </div>
        <div class="form-group">
            <label class="control-label">Type</label>
            <div class="btn-group btn-group-sm btn-group-toggle d-flex w-100" role="group" data-toggle="buttons">
                <label ng-repeat="type in $ctrl.settings.attributeSetTypes track by $index" ng-switch="type.name"
                    ng-class="{active: type.value === $ctrl.model.type}" class="btn btn-outline-primary btn-block mt-0"
                    ng-click="$ctrl.model.type=type.value;">
                    <input ng-model="$ctrl.model.type" type="radio" value="{{type.value}}" class="custom-control-input"
                        id="model_type_{{type.value}}">
                    <span ng-switch-when="System" class="" title="{{type}}"><i class="fas fa-cog"></i> System</span>
                    <span ng-switch-when="Set" class="" title="{{type}}"><i class="fas fa-database"></i> Data Set</span>
                    <span ng-switch-when="Page" class="" title="{{type}}"><i class="far fa-file"></i> Page</span>
                    <span ng-switch-when="Post" class="" title="{{type}}"><i class="far fa-newspaper"></i> Post</span>
                    <span ng-switch-when="Module" class="" title="{{type}}"><i class="fas fa-puzzle-piece"></i>
                        Module</span>
                    <span ng-switch-when="Service" class="" title="{{type}}"><i class="fas fa-layer-group"></i>
                        Service</span>
                </label>
            </div>
        </div>
        <div class="form-group">
            <label>Description</label>
            <textarea class="form-control" ng-model="$ctrl.model.description"></textarea>
        </div>
    </div>
</div>